import React, { useState } from 'react';
import axios from 'axios';
import './DataSender.css';

const DataSender = () => {
  const [message, setMessage] = useState('');
  const [selectedRequest, setSelectedRequest] = useState('');
  const [responseData, setResponseData] = useState('');

  const dynamicGetRequests = [
    { key: 'Отчет 1', url: 'http://localhost:8000/reception-data-resuest1/' },
    { key: 'Отчет 2', url: 'http://localhost:3000/request2' },
    { key: 'Отчет 3', url: 'http://localhost:3000/request3' },
    // Добавьте здесь остальные GET запросы
  ];

  const sendGetRequest = async () => {
    try {
      const response = await axios.get(dynamicGetRequests.find((req) => req.key === selectedRequest).url);
      setResponseData(response.data);
      setMessage('');
    } catch (error) {
      console.error('Ошибка при отправке запроса:', error);
      setMessage('Произошла ошибка при отправке запроса');
      setResponseData('');
    }
  };

  const handleSelectChange = (e) => {
    setSelectedRequest(e.target.value);
  };

  return (
    <div>
      <select onChange={handleSelectChange}>
        <option value="">Выберите запрос</option>
        {dynamicGetRequests.map((req) => (
          <option key={req.key} value={req.key}>{req.key}</option>
        ))}
      </select>
      <button onClick={sendGetRequest}>Отправить запрос</button>
      {responseData && <p>Полученные данные: {JSON.stringify(responseData)}</p>}
      {message && <p>{message}</p>}
    </div>
  );
};

export default DataSender;